<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <!--
          <a-col :span="24">
            <a-form-model-item label="法人代码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bankNoCd">
              <j-popup
                v-model="model.bankNoCd"
                field="id"
                org-fields="id"
                dest-fields="id"
                code="llbb_juridical_person"
                @input="popupCallback"
              />
            </a-form-model-item>
          </a-col>
          -->
          <a-col :span="24">
            <a-form-model-item label="采集报表编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="reporttypecode">
              <a-input v-model="model.reporttypecode" placeholder="请输入采集报表编码"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="采集报表表名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="reportTabName">
              <a-input v-model="model.reportTabName" placeholder="请输入采集报表表名"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="采集报表名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="reporttypename">
              <a-input v-model="model.reporttypename" placeholder="请输入采集报表名称"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="报表访问路径" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="reportUrl">
              <!--<a-input v-model="model.reportUrl" placeholder="请输入报表访问路径"  ></a-input>-->
              <a-tree-select
                style="width:100%"
                :treeData="treeData"
                v-model="model.reportUrl"
                :replaceFields="{children:'children', title:'title', key:'key', value: 'url' }"
                placeholder="请选择报表访问路径">
              </a-tree-select>
            </a-form-model-item>
          </a-col>
          <!--
          <a-col :span="24">
            <a-form-model-item label="角色分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!roleDisabled" >
              <JMultiSelectTag placeholder="请选择角色" v-model="model.selectedroles" dictCode="SYS_ROLE,ROLE_NAME,id"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="数据校验sql" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="sql">
              <a-textarea v-model="model.sql" rows="6" placeholder="请输入sql"/>
            </a-form-model-item>
          </a-col>
          -->
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import { addUser,editUser,queryUserRole,queryall,queryTreeList } from '@/api/api'

  export default {
    name: 'LlbbReportFormsForm',
    components: {
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        disableSubmit:false,
        rolesOptions:[],
        roleDisabled: false,
        treeData:[],
        model:{
         },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: "/reportForms/llbbReportForms/add",
          edit: "/reportForms/llbbReportForms/edit",
          queryById: "/reportForms/llbbReportForms/queryById"
        }
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      //初始化角色字典
      initRoleList(){
        queryall().then((res)=>{
          if(res.success){
            this.rolesOptions = res.result.map((item,index,arr)=>{
              let c = {label:item.roleName, value:item.id}
              return c;
            })
          }
        });
      },
      loadMenuTree(){
        //加载菜单树
        var that = this;
        queryTreeList().then((res)=>{
          if(res.success){
            that.treeData = [];
            let treeList = res.result.treeList;
            for(let a=0;a<treeList.length;a++){
              let temp = treeList[a];
              temp.isLeaf = temp.leaf;
              that.treeData.push(temp);
            }
            console.log(that.treeData);
          }
        });
      },
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        /*this.model = Object.assign({}, record);*/
       this.model = Object.assign({},{selectedroles:'',selecteddeparts:''}, record);
        if(record.hasOwnProperty("reporttypecode")){
          this.queryRole(record.reporttypecode);
        }
        this.visible = true;
        //加载菜单树
        this.loadMenuTree();
      },
      queryRole(reportCode){
        getAction('/rolereport/llbbRoleReport/queryReportByCode',{'reportCode':reportCode}).then((res)=>{
          if(res.success){
            this.model.selectedroles = res.result.join(",");
          }else{
            this.$message.warning(res.message);
          }
        })
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          }

        })
      },
    }
  }
</script>